import 'package:flutter/material.dart';
import 'package:flutter_fun_zjversion/config/resource_manager.dart';
import 'package:flutter_fun_zjversion/config/router_config.dart';
import 'package:flutter_fun_zjversion/generated/i18n.dart';

class SplashImage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Container(
      color: Colors.white,
      child: Image.asset(
        ImageHelper.wrapAssets('splash_bg.png'),
        fit: BoxFit.fill,
      ),
    );
  }
}


class SplashPage extends StatefulWidget {
  @override
  SplashPageState createState() => new SplashPageState();
}

class SplashPageState extends State<SplashPage> with TickerProviderStateMixin{

  AnimationController _logoController;
  Animation<double> _animation;
  AnimationController _countdownController;

  @override
  void initState() {
    _logoController = new AnimationController(vsync: this,duration: Duration(milliseconds: 1500));

    _animation = Tween(begin: 0.0,end: 1.0).animate(CurvedAnimation(parent: _logoController, curve: Curves.easeInOutBack));

    _animation.addStatusListener((status){
      if (status == AnimationStatus.completed) {
        _logoController.reverse();
      } else if (status == AnimationStatus.dismissed) {
        _logoController.forward();
      }
    });
    _logoController.forward();
    _countdownController = new AnimationController(vsync: this,duration: Duration(seconds: 4));
    _countdownController.forward();
    super.initState();
  }

  @override
  void dispose() {
    // TODO: implement dispose
    _logoController.dispose();
    _countdownController.dispose();
    super.dispose();

  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: WillPopScope(onWillPop: ()=>Future.value(false),
        child: Stack(
          fit: StackFit.expand,
          children: <Widget>[
            Image.asset(ImageHelper.wrapAssets('splash_bg.png'),fit: BoxFit.fill,),
            AnimatedFlutterLogo(animation: _animation,),
            Align(
              alignment: Alignment(0.0, 0.7),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  AnimatedAndroidLogo(animation: _animation,)
                ],
              ),
            ),
            Align(
              alignment: Alignment.bottomRight,
              child: SafeArea(
                  child:InkWell(
                    onTap: (){
                      nextPage(context);
                    },
                    child: Container(
                      padding: EdgeInsets.symmetric(horizontal: 20,vertical: 5),
                      margin: EdgeInsets.only(right: 20,bottom: 20),
                      decoration: BoxDecoration(
                        color: Colors.black.withAlpha(100),
                        borderRadius: BorderRadius.circular(40)
                      ),
                      child: AnimatedCountdown(
                        context: context,
                        animation: StepTween(begin: 3,end: 0).animate(_countdownController),
                      ),
                    ),
                  ) 
              ),
            )
          ],
        ),
      ),
    );
  }

}
void nextPage(context) {
  Navigator.of(context).pushReplacementNamed(RouteName.tab);
}

class AnimatedCountdown extends AnimatedWidget{
  final Animation<int> animation;


  AnimatedCountdown({key,this.animation,context}):super(key:key,listenable:animation){
    this.animation.addStatusListener((status){
      if(status == AnimationStatus.completed){
        nextPage(context);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    int value = animation.value+1;
    return Text(
      (value == 0 ? '' : '$value | ') + S.of(context).splashSkip,
      style: TextStyle(color: Colors.white),
    );
  }

}

class AnimatedFlutterLogo extends AnimatedWidget{

  AnimatedFlutterLogo({
    Key key,
    Animation<double> animation,
  }) : super(key: key, listenable: animation);
  
   @override
  Widget build(BuildContext context) {
     final Animation<double> animation = listenable;
    // TODO: implement build
    return AnimatedAlign(alignment: Alignment(0, 0.2 + animation.value * 0.3), 
        duration: Duration(milliseconds: 10),
        curve: Curves.bounceOut,
        child: Image.asset(ImageHelper.wrapAssets("splash_flutter.png"),
          width: 280,
          height: 120,
        ),
    );
  }
}

class AnimatedAndroidLogo extends AnimatedWidget {
  AnimatedAndroidLogo({
    Key key,
    Animation<double> animation,
  }) : super(key: key, listenable: animation);

  @override
  Widget build(BuildContext context) {
    final Animation<double> animation = listenable;
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        Image.asset(
          ImageHelper.wrapAssets('splash_fun.png'),
          width: 140 * animation.value,
          height: 80 * animation.value,
        ),
        Image.asset(
          ImageHelper.wrapAssets('splash_android.png'),
          width: 200 * (1 - animation.value),
          height: 80 * (1 - animation.value),
        ),
      ],
    );
  }
}